/**
 * Created by Administrator on 2017/4/7 0007.
 */
Space={
    Create:function(scene,camera,renderer){
        var space={};
        var controls;
        var objects = [];
        var targets = { table: [], sphere: [], helix: [], grid: [] };
        var bl_auto=false;
        var clickedSquarePoint=new THREE.Vector3();
        var clickedSquareIdx;



        controls = new THREE.TrackballControls(camera, renderer.domElement,scene);
        controls.rotateSpeed = 0.5;
        controls.minDistance = 0;
        controls.maxDistance = 10000;
        camera.position.z=1500;
        controls.enabled=true;
        // controls.addEventListener( 'change', controlsChange );




        var table=netElementData;
        var arrSquare=[];
        var arrGroup=[];
        var arrType=[];
        arrType.push(new THREE.TextureLoader().load("three/images/ico1.png"));
        arrType.push(new THREE.TextureLoader().load("three/images/ico2.png"));
        arrType.push(new THREE.TextureLoader().load("three/images/ico3.png"));
        arrType.push(new THREE.TextureLoader().load("three/images/ico4.png"));
        arrType.push(new THREE.TextureLoader().load("three/images/ico5.png"));
        arrType.push(new THREE.TextureLoader().load("three/images/ico6.png"));
        arrType.push(new THREE.TextureLoader().load("three/images/ico7.png"));

        var arrAlarm=[];
        arrAlarm.push(new THREE.TextureLoader().load("three/images/brown.png"));
        arrAlarm.push(new THREE.TextureLoader().load("three/images/blue.png"));
        arrAlarm.push(new THREE.TextureLoader().load("three/images/yellow.png"));
        arrAlarm.push(new THREE.TextureLoader().load("three/images/orange.png"));
        arrAlarm.push(new THREE.TextureLoader().load("three/images/red.png"));


        //加载字体
        var loader = new THREE.FontLoader();
        var font;
        loader.load( 'three/balaJS/helvetiker_chinese2.typeface.json', function ( response ) {
            font = response;
            start();
        } );

        function start(){

        var element = document.createElement( 'div' );
        element.className = 'element';
        element.style.backgroundColor = 'rgba(0,127,127,' + (Math.random() * 0.5 + 0.25 ) + ')';

        var number = document.createElement( 'div' );
        number.className = 'number';
        number.textContent = 123;
        element.appendChild( number );

        var symbol = document.createElement( 'div' );
        symbol.className = 'symbol';
        symbol.textContent = 'bala';
        element.appendChild( symbol );

        var details = document.createElement( 'div' );
        details.className = 'details';
        details.innerHTML = 'guagua'+ '<br>' + 'gaga';
        element.appendChild( details );
        // table
            var iValue=7;

        for ( var i = 0; i < table.length; i += iValue) {
            var element = document.createElement( 'div' );
            element.className = 'element';
            element.style.backgroundColor = 'rgba(0,127,127,' + ( Math.random() * 0.5 + 0.25 ) + ')';

            var number = document.createElement( 'div' );
            number.className = 'number';
            number.textContent = (i/iValue) + 1;
            element.appendChild( number );

            var symbol = document.createElement( 'div' );
            symbol.className = 'symbol';
            symbol.textContent = table[ i ];
            element.appendChild( symbol );

            var details = document.createElement( 'div' );
            details.className = 'details';
            details.innerHTML = table[ i + 1 ] + '<br>' + table[ i + 2 ];
            element.appendChild( details );

            var object = new THREE.CSS3DObject( element );
            object.position.x = Math.random() * 4000 - 2000;
            object.position.y = Math.random() * 4000 - 2000;
            object.position.z = Math.random() * 4000 - 2000;
            scene.add( object );
            object.name=table[i];
            object.groupid=table[i+2];
            objects.push( object );




            //

            var object = new THREE.Object3D();
            object.position.x = ( table[ i + 3 ] * 140 ) - 1330;
            object.position.y = - ( table[ i + 4 ] * 180 ) + 990;
            object.position.z = 0;
            targets.table.push( object );

            // if(arrBala[table[i+2]]==null){
            //     arrBala[table[i+2]]=[];
            // }
            // arrBala[table[i+2]].push(object);


            var color;
            switch (table[i+5]){
                case 1:color=0x47964b;break;
                case 2:color=0x2f8bae;break;
                case 3:color=0x3b7dad;break;
                case 4:color=0xa8775f;break;
                case 5:color=0xc64268;break;
            }

            //背景色块
            var g = new THREE.BoxGeometry(120, 160, 5, 1, 1, 1);
            var m = new THREE.MeshBasicMaterial({map:arrAlarm[table[i+5]-1],transparent:true});
            var bg = new THREE.Mesh(g, m);
            m.opacity=0.6;
            // scene.add(cube);
            // cube.position.set(object.position.x,object.position.y,0);
            //
            // cube.name=table[i];
            // cube.groupid=table[i+2];
            // arrSquare.push(cube);

            //文字
            var text=new Text3D(table[i],font);
            text.position.set(-50,-60,5);
            // text.scale.z=0.1;


            //类型图片
            var g = new THREE.BoxGeometry(120, 160, 5, 1, 1, 1);
            var m = new THREE.MeshBasicMaterial({map:arrType[table[i+6]-1],transparent:true});
            var type = new THREE.Mesh(g, m);
            type.position.z= 1;
            if(table[i+6]==6||table[i+6]==7) {
                // type.position.set(0,10,1);
            }



            var square=new THREE.Object3D();
            square.position.set(Math.random() * 4000 - 2000,Math.random() * 4000 - 2000,Math.random() * 4000 - 2000);
            square.name=table[i];
            square.groupid=table[i+2];
            square.groupLinkid=table[i+1];
            square.index=i/iValue;



            square.add(bg);
            square.add(text);
            square.add(type);
            arrSquare.push(square);
            scene.add(square);
        }


        // aa.position.set(200,200,0);



        // sphere
        var vector = new THREE.Vector3();
        var spherical = new THREE.Spherical();
        for ( var i = 0, l = objects.length; i < l; i ++ ) {
            var phi = Math.acos( -1 + ( 2 * i ) / l );
            var theta = Math.sqrt( l * Math.PI ) * phi;
            var object = new THREE.Object3D();
            spherical.set( 900, phi, theta );
            object.position.setFromSpherical( spherical );
            vector.copy( object.position ).multiplyScalar(2);
            object.lookAt( vector );
            targets.sphere.push( object );
        }

        // helix
        var vector = new THREE.Vector3();
        var cylindrical = new THREE.Cylindrical();
        for ( var i = 0, l = objects.length; i < l; i ++ ) {
            var theta =i * 0.175 + Math.PI;
            var y = - ( i * 8 ) + 450;
            var object = new THREE.Object3D();
            cylindrical.set( 900-i*2, theta, y );
            object.position.setFromCylindrical( cylindrical );
            vector.x = object.position.x *2;
            vector.y = object.position.y;
            vector.z = object.position.z *2;
            object.lookAt(vector);
            targets.helix.push( object );
        }
        // grid
        for ( var i = 0; i < objects.length; i ++ ) {
            var object = new THREE.Object3D();
            object.position.x = ( ( i % 5 ) * 400 ) - 800;
            object.position.y = ( - ( Math.floor( i / 5 ) % 5 ) * 400 ) + 800;
            object.position.z = ( Math.floor( i / 25 ) ) * 1000 - 2000;
            targets.grid.push( object );
        }
        transform( targets.table, 2 );


        //改变显示方式
        document.addEventListener("viewChange",function(e){
            switch (e.detail){
                case 1:transform(targets.table,2);break;
                case 2:transform(targets.helix,2);break;
                case 3:transform(targets.grid,2);break;
            }
        })




        //拖动函数 第一个参数为获得方块群组，最后一个参数为CSS3DOBJ群组
        var dragControls = new THREE.DragControls(arrSquare, camera, renderer.domElement ,objects);
        dragControls.deactivate();
        // dragControls.activate();
        var canMove=false;


        // dragControls.addEventListener( 'dragstart', function ( event ) { controls.enabled = false; } );
        // dragControls.addEventListener( 'dragend', function ( event ) { controls.enabled = true; } );
        //显示网元信息时不能移动
        document.addEventListener("ShowNetElementInfo3D",function(e){
            if(clickedSquareIdx!=e.detail) {
                clickedSquareIdx = e.detail;
                clickedSquarePoint.copy(arrSquare[e.detail].position);
            }
            TweenMax.to(arrSquare[e.detail].position,1,{x:0,y:0,z:1800,ease:Cubic.easeInOut});
            TweenMax.to(arrSquare[e.detail].position,1,{delay:1.2,x:-405,y:150,z:1500,ease:Cubic.easeInOut});
            TweenMax.to(arrSquare[e.detail].rotation,1,{delay:1.2,y:Math.PI*2,ease:Cubic.easeInOut});
            controls.enabled=false;
        })
            document.addEventListener("CloseNetElementInfo3D",function(e){
                TweenMax.to(arrSquare[clickedSquareIdx].position,1.5,{delay:0.5,x:clickedSquarePoint.x,y:clickedSquarePoint.y,z:clickedSquarePoint.z,ease:Cubic.easeInOut});
                TweenMax.to(arrSquare[clickedSquareIdx].rotation,1.5,{delay:0.5,y:0,ease:Cubic.easeInOut});
                controls.enabled=true;
            })


        //显示 隐藏连线
        document.addEventListener("showOrHideLine3D",function(e){
                SHLine(e.detail);
        })
        //激活拖动/保存坐标
        document.addEventListener("canMoveOrNot3D",function(e){
            if(e.detail){
                controls.noRotate=true;
                controls.noPan=true;
                //可移动物体
                dragControls.activate();

                //镜头回正
                obverseSide();
            }
            else{
                lineDispose();
                ShowLine();
                // SHLine(false);

                controls.noRotate=false;
                controls.noPan=false;
                dragControls.deactivate();
            }
        })
            //是否自动旋转
            document.addEventListener("autoPlayOrNot3D",function(e){
                if(bl_auto){
                    bl_auto=false;
                    controls.bl_UD=true;
                }
                else{
                    bl_auto=true;
                    obverseSide();
                    controls.bl_UD=false;
                }
            })










        }













        //线条生成
        var guagua=[];
        var arrLine=[];
        function ShowLine(){
            var no;
            var linkno;
            var square;
            arrGroup=[];
            arrLine=[];
            guagua=[];
            for(var z=0;z<arrSquare.length;z++){
                if(no==arrSquare[z].groupid){
                    continue;
                }
                no=arrSquare[z].groupid;
                linkno=arrSquare[z].groupLinkid;
                square=arrSquare[z];
                arrGroup.push(z);

                guagua.push(no);
                guagua.push(linkno);
                arrGroup[no.toString()]=z;
            }

            for(var z=0;z<guagua.length-2;z+=2){
                var Idx1=arrGroup[guagua[z]];
                var Idx2=arrGroup[guagua[z+1]];
                var square1=arrSquare[Idx1];
                var square2=arrSquare[Idx2];

                var sline=new SLine(square1.position.x,square1.position.y,square2.position.x,square2.position.y,25,10,10);
                arrLine.push(sline);
                scene.add(sline);
            }
        }
        function SHLine(bl){
            for(var z=0;z<arrLine.length;z++){
                TweenMax.killTweensOf(arrLine[z]);
                arrLine[z].split(bl);
            }
        }
        function lineDispose(){
            for(var z=0;z<arrLine.length;z++){
                scene.remove(arrLine[z]);
                arrLine[z]=[];
            }
            arrLine=[];
        }


        function transform( getTargets, duration ) {

            obverseSide();
            for ( var i = 0; i < arrSquare.length; i ++ ) {
                var object = arrSquare[ i ];
                var target = getTargets[ i ];
                TweenMax.to(object.position,duration,{x:target.position.x,y:target.position.y,z:target.position.z,ease:Cubic.easeInOut});
                TweenMax.to(object.rotation,duration,{x:target.rotation.x,y:target.rotation.y,z:target.rotation.z,ease:Cubic.easeInOut});
            }
            SHLine(true);
            if(getTargets!=targets.helix) {
                setTimeout(function () {
                    lineDispose();
                    ShowLine();
                    SHLine(false);
                }, duration * 1000+50)
            }

            if(getTargets==targets.helix||getTargets==targets.grid){
                //开始自动播放，且不能上下翻转
                bl_auto=true;
                controls.bl_UD=false;
                obverseSide();
            }
            else{
                //停止自动播放，可以上下翻转
                bl_auto=false;
                controls.bl_UD=true;
            }
        }



        //镜头回正
        function obverseSide() {
            TweenMax.to(camera.position, 1, {x: 1, y: 1, z: 2000, ease: Cubic.easeInOut});
            TweenMax.to(controls.target, 1, {x: 0, y: 0, z: 0, ease: Cubic.easeInOut});
            TweenMax.to(camera.rotation, 1, {x: 0, y: 0, z: 0, ease: Cubic.easeInOut});
        }


        space.DoIt=function(){
            controls.update();
            for(var z=0;z<arrLine.length;z++){
                arrLine[z].DoIt();
            }
            if(bl_auto){
                controls.moveCurr.x+=0.001;
            }
        }
        return space;
    }
}